﻿@using pageRes = FlashCards.WebApp.Resources.PageResources
@model FlashCards.WebApp.Models.HomeModel
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#categories").menu();
    });
</script>
<style>
    .ui-menu
    {
        width: 200px;
    }
</style>
@helper CreateTree(FlashCards.WebApp.Models.CategoryModel category)
    {
    <li>@Html.ActionLink(category.Name, "ShowCategory", new { categoryId = category.Id, userId = Model.UserId })
        @if (category.Children != null && category.Children.Count > 0)
        {
            <ul>
                @foreach (var child in category.Children)
                {
                    @CreateTree(child);
                }
            </ul>
        }
    </li>          
}
@{
    ViewBag.Title = "Home Page";
}
@if (Model != null)
{
    <div>
        <h3>@pageRes.DevelopmentNews</h3>
        <div class="content-center">
            @if (Model.LatestNews != null && Model.LatestNews.Count > 0)
            {
                foreach (var item in Model.LatestNews)
                {
                    <h5>@item.Date - @item.Title</h5>
                    <span>@item.Message</span>
                }
            }
            else
            {
                <span>@pageRes.DevelopmentNewsEmpty</span>
            }
        </div>
        <h3>@pageRes.Categories</h3>
        <ul id="categories">
            @foreach (var item in Model.TopLevelCategories)
            {
                @CreateTree(item);
            }
        </ul>

        <div style="height: 200px"></div>
    </div>
}
